import React, { Component } from 'react';
// import { TabBar, } from 'antd-mobile'
import { FileOutline, HeartOutline, UploadOutline } from 'antd-mobile-icons'
import { Toast, Popover } from 'antd-mobile'
import {
    AntOutline,
    HandPayCircleOutline,
    ScanningOutline,
    TransportQRcodeOutline,
} from 'antd-mobile-icons'
import { withRouter } from "react-router-dom"
import { GoodFav, ShopcartAdd } from '../../api/details';

class Bottom extends Component {
    constructor(props) {
        super(props)
        this.state = {
            actions: [
                { key: 'scan', icon: <ScanningOutline />, text: '扫一扫' },
                { key: 'payment', icon: <HandPayCircleOutline />, text: '付钱/收钱' },
                { key: 'bus', icon: <TransportQRcodeOutline />, text: '乘车码' },
                { key: 'assistant', icon: <AntOutline />, text: '智能助理' },
            ]
        }
    }

    leftButtonSc() {
        if (localStorage.getItem("token")) {
            GoodFav({ userid: JSON.parse(localStorage.getItem("userid")), goodid: this.props.goodsid }).then(
                (res) => {
                    console.log(res);
                    if (res.data.msg === "已收藏!") {
                        Toast.show({
                            icon: 'success',
                            content: '收藏成功',
                        })
                        setTimeout(() => {
                            this.props.history.push("/mycollection")
                        }, 2000)
                    }
                }
            )
        }else{
            Toast.show({
                icon: 'fail',
                content: '请先登录',
            })
        }

    }
    leftButtonGwc() {
        this.props.history.push("/index/cart")
    }

    setCart() {
        if (localStorage.getItem("token")) {
            ShopcartAdd({ userid: localStorage.getItem("userid"), goodid: this.props.goodsid }).then((res) => {
                console.log(res);
                if (res.data.code === 200) {
                    Toast.show({
                        icon: 'success',
                        content: '加入购物车',
                    })
                }
            })
        } else {
            Toast.show({
                icon: 'fail',
                content: '请先登录',
            })
        }

    }
    render() {
        return (
            <div className='bottom'>
                <div className='left'>
                    <div className='left-button-SC' onClick={() => { this.leftButtonSc() }}>
                        <p><HeartOutline /></p>
                        <p>收藏</p>
                    </div>

                    <Popover.Menu
                        mode='dark'
                        actions={this.state.actions}
                        placement='right-start'
                        onAction={node => Toast.show(`选择了 ${node.text}`)}
                        trigger='click'
                    >
                        <div className='left-button-FX'>
                            <p><UploadOutline /></p>
                            <p>分享</p>
                        </div>
                    </Popover.Menu>


                    <div className='left-button-GWC' onClick={() => { this.leftButtonGwc() }}>
                        <p><FileOutline /></p>
                        <p>购物车</p>
                    </div>
                </div>
                <div className='right'>
                    <div className='bigbutton'>
                        <button className='right-cart' onClick={() => { this.setCart() }}>加入购物车</button>
                        <button className='right-buy'>立即购买</button>
                    </div>
                </div>

            </div>
        );
    }
}

export default withRouter(Bottom);